<template><app-layout>
		<view class="template-order">
			<tn-nav-bar> 待走访</tn-nav-bar>
			<!-- 顶部自定义导航 -->
			<!-- 	<view class="tabs-fixed tn-bg-white">
				<view class="tn-flex tn-flex-col-between tn-flex-col-center tn-padding-top-sm"
					:style="{marginTop: vuex_custom_bar_height + 'px'}">
					<view class="justify-content-item"  style="width: 100vw;overflow: hidden;">
						<tn-tabs class="tabs" :list="tablist" :countshow="!!0" :isScroll="false" :current="type" 
							name="tab-name"  @change="tabsChange"></tn-tabs>
					</view>
				</view>
			</view> -->
			<view :style="{paddingTop: vuex_custom_bar_height + 'px'}">

				<view class="list">
					<view class="li" v-for="item in tasknum" :key="item.id">
						<tn-list-cell :radius="!!1" unlined :arrow="true" :arrowRight="true"
							@click="goselect(item.id) ">
							<view slot="default" class="tn-flex tn-flex-row-between tn-flex-col-center">
								<view class="tn-flex tn-flex-row-center  tn-flex-col-center">
									<text class="tn-icon-trusty tn-text-xxl tn-color-red"
										style="padding: 10rpx;"></text>
									<view class="date">
										{{item.name}}
									</view>
								</view>
								<view class="type ">
									{{item.num}}人
								</view>
							</view>
						</tn-list-cell>
					</view>
				</view>
			</view>
		</view>
	</app-layout>
</template>

<script>
	import templatePageMixin from '@/libs/mixin/template_page_mixin.js'

	export default {
		name: 'TemplateOrder',
		mixins: [templatePageMixin],
		data() {
			return {
				tablist: [{
						name: '辖区任务'
					},
					{
						name: '委托任务',
					},
				],
				//分类 1辖区内2委托
				type: 0,
				tasknum: []
			}
		},
		onLoad() {
			this.getList();
		},
		onReady() {

		},

		methods: {
			// 跳转
			goselect(id) {
				this.$t.vuex('return_url', `/discoveryPages/interview/add?mfid=${this.mfid}`)
				//检查类型  1走访2尿检3发检
				uni.navigateTo({
					url: `/discoveryPages/userselect/userlist?type=1&fenlei=${this.type+1}&zq=${id}`,
				});
			},
			// 标签栏值发生改变
			tabsChange(index) {
				this.type = index
				this.page = 1;
				this.getList();
			},
			getList() {
				this.$t.message.loading('加载中');
				this.$request({
					url: this.$api.interview.tasknum,
					data: {
						type: this.type + 1
					}
				}).then(response => {
					this.$t.message.closeLoading();
					if (response.code === 0) {
						this.tasknum = response.list
					} else {
						uni.showModal({
							title: '',
							content: msg,
							showCancel: false,
						});
					}
				}).catch((msg) => {
					this.$t.message.toast(msg);
					this.$t.message.closeLoading();
				});
			},

		}
	}
</script>

<style lang="scss" scoped>
	.template-order {}

	.addbtn {
		position: fixed;
		bottom: 100rpx;
		position: fixed;
		bottom: 13.33333vw;
		margin: auto;
		width: 80%;
		left: 0;
		right: 0;
		font-weight: bold;
	}

	.list {
		padding: 20rpx;

		.li {
			margin-bottom: 20rpx;
			border: 1px solid #eee;
			border-radius: 5px;

			.result {
				width: 100rpx;
				height: 100rpx;
				border-radius: 50%;
				display: flex;
				justify-content: center;
				align-items: center;
				margin-right: 20rpx;
				color: #fff;
			}

			.type {
				padding-right: 40rpx;
			}
		}
	}
</style>